import React from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import './App.css';

// 前台页面
import MallLayout from './components/layout/MallLayout';
import Home from './pages/mall/Home';
import Category from './pages/mall/Category';
import Cart from './pages/mall/Cart';
import Profile from './pages/mall/Profile';
import ProductDetail from './pages/mall/ProductDetail';
import CreateOrder from './pages/mall/CreateOrder';
import Payment from './pages/mall/Payment';
import OrderDetail from './pages/mall/OrderDetail';
import Login from './pages/mall/Login';
import Orders from './pages/mall/Orders';

// 后台页面
import AdminLayout from './components/layout/AdminLayout';
import AdminLogin from './pages/admin/AdminLogin';
import AdminDashboard from './pages/admin/Dashboard';
import ProductManagement from './pages/admin/ProductManagement';
import CategoryManagement from './pages/admin/CategoryManagement';
import OrderManagement from './pages/admin/OrderManagement';
import RoleManagement from './pages/admin/RoleManagement';
import AdminUserManagement from './pages/admin/AdminUserManagement';
import ProtectedRoute from './components/ProtectedRoute';

const App: React.FC = () => {
  return (
    <ConfigProvider locale={zhCN}>
      <Router>
        <div className="App">
          <Routes>
            {/* 前台路由 */}
            <Route path="/" element={<MallLayout />}>
              <Route index element={<Home />} />
              <Route path="category" element={<Category />} />
              <Route path="cart" element={
                <ProtectedRoute requireAuth>
                  <Cart />
                </ProtectedRoute>
              } />
              <Route path="profile" element={
                <ProtectedRoute requireAuth>
                  <Profile />
                </ProtectedRoute>
              } />
              <Route path="product/:id" element={<ProductDetail />} />
              <Route path="order/create" element={
                <ProtectedRoute requireAuth>
                  <CreateOrder />
                </ProtectedRoute>
              } />
              <Route path="payment/:orderId" element={
                <ProtectedRoute requireAuth>
                  <Payment />
                </ProtectedRoute>
              } />
              <Route path="order/:id" element={
                <ProtectedRoute requireAuth>
                  <OrderDetail />
                </ProtectedRoute>
              } />
              <Route path="orders" element={
                <ProtectedRoute requireAuth>
                  <Orders />
                </ProtectedRoute>
              } />
            </Route>
            
            {/* 前台登录 */}
            <Route path="/login" element={<Login />} />
            
            {/* 后台路由 */}
            <Route path="/admin/login" element={<AdminLogin />} />
            <Route path="/admin" element={
              <ProtectedRoute requireAdmin>
                <AdminLayout />
              </ProtectedRoute>
            }>
              <Route index element={<AdminDashboard />} />
              <Route path="products" element={<ProductManagement />} />
              <Route path="categories" element={<CategoryManagement />} />
              <Route path="orders" element={<OrderManagement />} />
              <Route path="roles" element={<RoleManagement />} />
              <Route path="users" element={<AdminUserManagement />} />
            </Route>
          </Routes>
        </div>
      </Router>
    </ConfigProvider>
  );
};

export default App;
